<template>
	<div class="wrap-con">
		<div class="">1.测评工具：职业倦怠量表（MBI--GS）</div>
		<div class="">2.测评时间：{{ form.appraisalFinishDate }}</div>
		<div class="">
			3.MBI--GS简介：职业倦怠量表通用版（Maslach Burnout Inventory-General Survey，MBI-GS） 是评估职业人群倦怠状态的标准化工具，由心理学家 Christina
			Maslach 和 Susan Jackson
			于 1981
			年编制，后经多次修订形成适用于不同职业领域的通用版本。该量表基于职业倦怠的三维模型，广泛应用于医疗卫生、教育、服务业等行业，为组织管理、职业心理健康干预提供科学依据。
		</div>
		<div class="">4.测评数据结果：</div>
		<div class="textIndetStyle">总分：{{ form.appraisalScore }}</div>
		<div class="textIndetStyle">各维度得分:</div>
		<div style="text-indent: 4em;" v-for="item in form.userAppraisalDivisorList">
			<span class="">{{ item.divisorName }}：</span>
			<span class="">
				{{ item.divisorScore }}
			</span>
		</div>
		<div class="">5.总体结果解读及干预建议：</div>
		<div v-html="form.proposalSuggest"></div>
		<div class="">6.各维度结果解读及干预建议</div>
		<div class="" v-for="item in form.userAppraisalDivisorList">
			<div class="textIndetStyle">{{ item.divisorName }}：</div>
			<div v-if="item.proposalSuggest">
				<div v-html="item.proposalSuggest"></div>
			</div>
		</div>
		<div class="say">声明：</div>
		<div class="textIndetStyle">以上调查结论及建议只是基于您的问卷调查结果，可能会因未能收集您的更多信息导致报告结果与您的实际状态不完全相符，请根据您的具体情况加以取舍。</div>
	</div>
</template>

<script>
import { getUserAppraisal } from '@/api/member/index.js'
export default {
	data() {
		return {
			form: {}
		};
	},
	watch: {
		// 监听 detailId 变化
		detailId(newVal) {
			if (newVal) {
				this.getDetail(newVal)
			}
		},
		// 监听 appraisalId 变化
		appraisalId(newVal) {
			if (newVal) {
				this.getDetail(newVal)
			}
		}
	},
	mounted() {
		// 初始化加载数据
		if (this.detailId) {
			this.getDetail(this.detailId)
		}
	},
	props: ['detailId', 'appraisalId'],
	methods: {
		getDetail(id) {
			getUserAppraisal(id).then((res) => {
				this.form = res.data;
			});
		}
	}
};
</script>

<style></style>

<!-- <template>
	<div class="">
		<l-painter ref="painter">
			<l-painter-div css="background: #f0f0f0; padding-top: 100rpx;">
				<l-painter-div>
					<l-painter-text text="1.测评工具：职业倦怠量表（MBI--GS）" css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;" />
				</l-painter-div>
				<l-painter-div>
					<l-painter-text text="测评时间：" css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;" />
					<l-painter-text :text="form.appraisalFinishDate" css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;" />
				</l-painter-div>
				<l-painter-div>
					<l-painter-text text="总分：" css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;" />
					<l-painter-text :text="form.appraisalScore" css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;" />

					<l-painter-text
						:text="form.proposalSuggest"
						css="font-family: Microsoft YaHei;font-weight: 400;font-size: 30rpx;color: #111111;white-space: pre-wrap;word-break: break-word;"
					/>
				</l-painter-div>
			</l-painter-div>
		</l-painter>
		<div class="share_bo" @click="saveImage">保存图片</div>
	</div>
</template>
<script>
import upload from '@/utils/upload';
import { getUserAppraisal } from '@/api/evaluate/index.js';
export default {
	data() {
		return {
			form: {}
		};
	},
	methods: {
		getDetail(id) {
			getUserAppraisal(id).then((res) => {
				this.form = res.data;
				this.typeForm1 = this.form.userAppraisalDivisorList.find((item) => item.divisorId == 1);
				this.typeForm2 = this.form.userAppraisalDivisorList.find((item) => item.divisorId == 2);
				this.typeForm3 = this.form.userAppraisalDivisorList.find((item) => item.divisorId == 3);
				this.form.proposalSuggest = this.form.proposalSuggest.replace(/<img/gi, '<img style="max-width:100%;height:auto;"');
			});
		},
		saveImage() {
			this.$refs.painter.canvasToTempFilePathSync({
				fileType: 'png',
				pathType: 'url',
				quality: 1,
				success: (res) => {
					console.log(res.tempFilePath);
					upload({
						filePath: res.tempFilePath
					}).then((res) => {
						console.log(res);
					});
				}
			});
		}
	}
};
</script -->
